import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuick.Layouts 2.15
import MyUtils 1.0
import 'component/recommend'

ScrollView {
	clip: true
	
	
	HttpUtils {
		id: http
	}
	Component.onCompleted: {
		getBannerList()
		
	}
	
	function getBannerList() {
		function onReply(reply) {
			// console.log(reply)
			const bannerReply = JSON.parse(reply);
			bannerView.bannerList = bannerReply['banners']
			http.onReplySignal.disconnect(onReply)
			getHotList()
		}
		
		http.onReplySignal.connect(onReply)
		http.connect('banner')
	}
	
	function getHotList() {
		function onReply(reply) {
			// console.log(reply)
			const playListsReply = JSON.parse(reply);
			hotView.playLists = playListsReply['playlists']
			// playListsReply['playlists'].forEach(function(playlist) {
			// 	console.log(playlist.coverImgUrl);
			// });
			http.onReplySignal.disconnect(onReply)
			getLatestList()
		}
		
		http.onReplySignal.connect(onReply)
		http.connect('top/playlist/highquality?limit=20')
	}
	
	function getLatestList() {
		function onReply(reply) {
			// console.log(reply)
			const playListsReply = JSON.parse(reply);
			latestView.playLists = playListsReply['data'].slice(0,30)
			// playListsReply['playlists'].forEach(function(playlist) {
			// 	console.log(playlist.coverImgUrl);
			// });
			http.onReplySignal.disconnect(onReply)
		}
		
		http.onReplySignal.connect(onReply)
		http.connect('top/song')
	}
	
	ColumnLayout {
		Rectangle {
			Layout.fillWidth: true
			width: parent.width
			height: 60
			color: Qt.color('#00000000')
			Text {
				text: qsTr('推荐内容')
				x: 10
				verticalAlignment: Text.AlignBottom
				font.family: window.fontFamily
				font.pointSize: 25
			}
		}
		MusicBannerView {
			id: bannerView
			Layout.preferredWidth: window.width - 200
			Layout.preferredHeight: (window.width - 200) * 0.3
			Layout.fillWidth: true
			Layout.fillHeight: true
		}
		Rectangle {
			Layout.fillWidth: true
			width: parent.width
			height: 60
			color: Qt.color('#00000000')
			Text {
				text: qsTr('热门歌单')
				x: 10
				verticalAlignment: Text.AlignBottom
				font.family: window.fontFamily
				font.pointSize: 25
			}
		}
		MusicGridHotView {
			id: hotView
			// Layout.preferredWidth: window.width - 200
			Layout.preferredHeight: (window.width - 250) * 0.2 * 4 + 30 * 4 + 20
			Layout.bottomMargin: 20
			Layout.fillWidth: true
			Layout.fillHeight: true
		}
		Rectangle {
			Layout.fillWidth: true
			width: parent.width
			height: 60
			color: Qt.color('#00000000')
			Text {
				text: qsTr('新歌推荐')
				x: 10
				verticalAlignment: Text.AlignBottom
				font.family: window.fontFamily
				font.pointSize: 25
			}
		}
		MusicGridLatestView {
			id: latestView
			Layout.fillWidth: true
			Layout.fillHeight: true
			Layout.preferredHeight: (window.width - 230) * 0.1 * 10 + 30
			Layout.bottomMargin: 30
		}
	}
}